#{extends '/template/main.html' /}
<!-- treeTable -->
<link rel="stylesheet" href="/public/treeTable/default/jquery.treeTable.css">
<link rel="stylesheet" href="/public/treeTable/vsStyle/jquery.treeTable.css">
<script src="/public/treeTable/jquery.treeTable.js"></script>
<script src="/public/js/ulmsale/common.js"></script>
<script src="/public/lib/layer/js/layer.js"></script>
<style>
    .col-sm-2-label{
        float: left;
        padding-left: 10px;
        padding-right: 10px;
        width: 13%;
    }
    .col-sm-10-input{
        float: left;
        width: 18%;
    }
    .col-sm-10-row{
        float: left;
        width: 80%;
    }
    .td_input{
        border: 0;
        height: 30px;
        text-align: left;
        background-color:transparent;
    }
    .td_input_edit{
        height: 30px;
        text-align: left;
        border-radius:5px;
        width: 80%;
    }

    .Validform_checktip {
        text-align: left;
        line-height: 32px;
        padding-left: 10px;
    }
</style>

<script>
    var menuId='${adminMenu?.id}';
    var pageNumber = '${pageNumber}';
    $(function () {
        // 提示
        var msg = '${flash.get("msg")}';
        if (msg) {
            saveSuccess(msg);
        }

        getAsyncJSON("/power/admin/AdminMenuCtrl/loadMenuItemList", {menuId:menuId ,parentId: 0}, function (data) {
            initTree(data);

        });

    });

    function initTree(treeList) {
        $('#menuItemTree').html('');

        var trHtml  = ' <thead> <tr> <td>菜单名称</td> <td>业务编号</td><td>业务名称</td> <td>排序号</td> <td>操作</td> </tr> </thead>';
        for(var i = 0 ; i < treeList.length ; i++){
            var trData = treeList[i];
            var hasChild = (trData.isLeaf==true || trData.isLeaf == 1 )? '': true;
            var bussiness_id = trData.business != null ? trData.business.id : '';
            var bussiness_code = trData.business != null ? trData.business.code : '';
            var bussiness_name = trData.business != null ? trData.business.name : '';
            if(trData.parentId == 0){
                trHtml += '<tr id="'+trData.id+'"  hasChild="'+hasChild+'"> ';
                trHtml += '<td id="name_'+trData.id+'"><span controller="true">'+trData.name+'</span></td>';
                trHtml += '<td id="bussiess_code_'+trData.id+'">'+bussiness_code+'</td>';
                trHtml += '<td id="bussiess_name_'+trData.id+'">'+bussiness_name+'</td>';
                trHtml += '<td id="showOrder_'+trData.id+'">'+trData.showOrder+'</td>';
                trHtml += '<td><button class="btn btn-success" onclick="addChildNode('+trData.id+');">子级</button>';
                trHtml += '<button class="btn btn-info" onclick="editNode('+trData.id+','+trData.parentId+','+bussiness_id+');">编辑</button>';
                trHtml += '<button class="btn btn-pink" onclick="deletedComfim('+trData.id+');">删除</button></td>';
                trHtml += '</tr>';
            }else {
                trHtml += '<tr id="'+trData.id+'" hasChild="'+hasChild+'" name="pid_'+trData.parentId+'"  pid="'+trData.parentId+'"> ';
                trHtml += '<td id="name_'+trData.id+'">'+trData.name+'</td>';
                trHtml += '<td id="bussiess_code_'+trData.id+'">'+bussiness_code+'</td>';
                trHtml += '<td id="bussiess_name_'+trData.id+'">'+bussiness_name+'</td>';
                trHtml += '<td id="showOrder_'+trData.id+'">'+trData.showOrder+'</td>';
                trHtml += '<td><button class="btn btn-secondary" onclick="addNode('+trData.parentId+');">同级</button>';
                trHtml += '<button class="btn btn-success" onclick="addChildNode('+trData.id+');">子级</button>';
                trHtml += '<button class="btn btn-info" onclick="editNode('+trData.id+','+trData.parentId+','+bussiness_id+');">编辑</button>';
                trHtml += '<button class="btn btn-pink" onclick="deletedComfim('+trData.id+');">删除</button></td>';
                trHtml += '</tr>';

            }

        }
        $('#menuItemTree').append(trHtml);

        //初始化表格样式
        var option = {
            theme:'vsStyle',
            expandLevel :1 ,
            onSelect: function ($treeTable, id) {
                window.console && console.log('onSelect:' + id);
            },
            beforeExpand:function ($treeTable, id) {
                $.getJSON('/power/admin/AdminMenuCtrl/loadMenuItemList', {menuId:menuId ,parentId: id}, function (data) {
                    var trHtml = '';
                    if(data != null && data.length > 0) {
                        for (var i = 0; i < data.length; i++) {
                            var trData = data[i];
                            var hasChild = (trData.isLeaf == true || trData.isLeaf == 1 ) ? '' : true;
                            var bussiness_id = trData.business != null ? trData.business.id : '';
                            var bussiness_code = trData.business != null ? trData.business.code : '';
                            var bussiness_name = trData.business != null ? trData.business.name : '';
                            trHtml += '<tr id="' + trData.id + '" hasChild="'+hasChild+'" name="pid_'+trData.parentId+'"  pid="'+trData.parentId+'"> ';
                            trHtml += '<td id="name_'+trData.id+'">' + trData.name + '</td>';
                            trHtml += '<td id="bussiess_code_'+trData.id+'">'+bussiness_code+'</td>';
                            trHtml += '<td id="bussiess_name_'+trData.id+'">'+bussiness_name+'</td>';
                            trHtml += '<td id="showOrder_'+trData.id+'">'+trData.showOrder+'</td>';
                            trHtml += '<td><button class="btn btn-secondary" onclick="addNode('+trData.parentId+');">同级</button>';
                            trHtml += '<button class="btn btn-success" onclick="addChildNode('+trData.id+');">子级</button>';
                            trHtml += '<button class="btn btn-info" onclick="editNode('+trData.id+','+trData.parentId+' , '+bussiness_id+');">编辑</button>';
                            trHtml += '<button class="btn btn-pink" onclick="deletedComfim('+trData.id+');">删除</button></td>';
                            trHtml += '</tr>';
                        }
                        $treeTable.addChilds(trHtml , 1);
                    }

                })
            }

        }
        $('#menuItemTree').treeTable(option);
    }

    //添加节点
    function addNode( parentId) {
        //判断菜单是否存在
        if(menuId <=0 || menuId ==null || menuId =='' || menuId == 'undefined'){
            layer.msg('请先保存菜单,再添加菜单明细!');
            return ;
        }

        $('#id_menu_id').val(menuId);
        $('#id_menu_item_parent_id').val(parentId);
        $('#id_menu_item_id').val('');
        $('#id_menu_item_name').val('');
        $('#id_bussiness_id').val('');
        $('#id_bussiness_name').val('');
        $('#id_menu_item_show_order').val(0);
        $('#id_menu_item_pageNumber').val(pageNumber);
        $('#parent_menu_item_name').val($('#name_'+parentId).text());

        $('#menuItemDetail').modal('show');
    }
    //添加节点
    function addChildNode( parentId ) {
        //判断菜单是否存在
        if(menuId <=0 || menuId ==null || menuId =='' || menuId == 'undefined'){
            layer.msg('请先保存菜单,再添加菜单明细!');
            return ;
        }

        //判断父节点是否有业务,如果有业务,不可以添加子节点
        var bussiness = $('#bussiess_code_'+parentId).text() ;
        if(bussiness != null && bussiness != ''){
            layer.msg('该节点包含业务菜单,无法添加子菜单!');
            return ;
        }

        $('#id_menu_id').val(menuId);
        $('#id_menu_item_parent_id').val(parentId);
        $('#id_menu_item_id').val('');
        $('#id_menu_item_name').val('');
        $('#id_bussiness_id').val('');
        $('#id_bussiness_name').val('');
        $('#id_menu_item_show_order').val(0);
        $('#id_menu_item_pageNumber').val(pageNumber);
        $('#parent_menu_item_name').val($('#name_'+parentId).text());

        $('#menuItemDetail').modal('show');
    }


    //编辑节点
    function editNode(id , parentId , bussiness_id) {
        $('#id_menu_id').val(menuId);
        $('#id_menu_item_parent_id').val(parentId);
        $('#id_menu_item_id').val(id);
        $('#id_menu_item_name').val($('#name_'+id).text());
        $('#id_bussiness_id').val(bussiness_id);
        $('#id_bussiness_name').val($('#bussiess_name_'+id).text());
        $('#id_menu_item_show_order').val($('#showOrder_'+id).text());
        $('#id_menu_item_pageNumber').val(pageNumber);
        $('#parent_menu_item_name').val($('#name_'+parentId).text());

        $('#menuItemDetail').modal('show');
    }
    //删除
    function sureDeleted() {
        //获取删除的id
        var id =$('#deleteId').val();

        document.location.href='/power/admin/AdminMenuCtrl/deletedAdminMenuItem?menuItemId='+id+'&pageNumber='+pageNumber+'&menuId='+menuId;

    }
    //检测返回结果是否正确
    function catchDataError(data){
        if(data.resultStatus ==1)
            return true;
       layer.msg(data.resultMessage)
        return false;
    }

    //保存菜单明细
    function saveMenuItem() {
        var id_menu_item_name = $('#id_menu_item_name').val();
        if(id_menu_item_name == null || id_menu_item_name == ''){
            layer.msg('请填写菜单名称!');
            return;
        }

        $('#id_admin_menu_item').submit();

    }

    function selectBussiness() {
        //父级节点不可添加子菜单
        var menuItemId= $('#id_menu_item_id').val();
        if(menuItemId >0){
            var hasChild = $('#'+menuItemId).attr('hasChild');
            if(hasChild != null && hasChild){
                layer.msg('该菜单含有子菜单,不能添加业务!');
                return ;
            }
        }
        layer.open({
            title:"业务选择",
            type: 2,
            area: ['500px', '600px'],
            fixed: true,
            maxmin: false,
            content: '/power/admin/AdminBusinessCtrl/popBussinessList'
        });
    }

    function callBack(id , name) {
        $('#id_bussiness_id').val(id);
        $('#id_bussiness_name').val(name);
        layer.closeAll();
    }

    function save() {
        $('#idForm').submit();
    }
</script>

<div class="panel panel-default">
    <div class="panel-heading">
        <h3 class="panel-title">
            <button id="idBtnSave" class="btn btn-info" onclick="save();">保存</button>
        </h3>
        <div class="panel-options">
            <a href="#" data-toggle="panel" >
                <span class="collapse-icon">&ndash;</span>
                <span class="expand-icon">+</span>
            </a>
        </div>
    </div>
    <div class="panel-body">
        <form id="idForm" method="POST" role="form" action="/power/admin/AdminMenuCtrl/saveDetail" enctype="multipart/form-data" class="form-horizontal validate">
            <input id="idBusinessId" name="adminMenu.id" value="${adminMenu?.id}" type="hidden">
            <input id="idPageNumber" name="pageNumber" value="${pageNumber}" type="hidden">

            <div class="form-group">
                <label for="idCode" class=" col-sm-2-label control-label" >菜单编号</label>
                <div class="col-sm-10-input">
                    <input type="text" class="form-control " name="adminMenu.code" id="idCode" value="${adminMenu?.code}" readonly placeholder="">
                </div>
                <label for="idName" class="col-sm-2-label control-label" style="">菜单名称</label>
                <div class="col-sm-10-input">
                    <input type="text" class="form-control" name="adminMenu.name" value="${adminMenu?.name}" id="idName" placeholder="">
                </div>
                <label for="idAvailableStatus" class="col-sm-2-label control-label " style="">菜单状态</label>
                <div class="col-sm-10-input">
                    <select class="form-control" name="adminMenu.status" id="idAvailableStatus" placeholder="">
                        <option value="" #{if adminMenu?.status == null} selected="true"#{/if}>---请选择---</option>
                        <option value="AVAILABLE" #{if adminMenu?.status == models.constants.AvailableStatus.AVAILABLE } selected="true"#{/if}>启用</option>
                        <option value="FREEZE" #{if adminMenu?.status == models.constants.AvailableStatus.FREEZE } selected="true"#{/if}>禁用</option>
                    </select>
                </div>
            </div>
        </form>
    </div>
</div>

<div class="panel panel-default">
    <div class="panel-heading">
        <h3 class="panel-title" >
            <button id="idBtnSave" class="btn btn-secondary" onclick="addNode(0);">创建根目录</button>
        </h3>
    </div>
    <div class="panel-body">
        <table id="menuItemTree" class="table table-bordered table-striped" style="text-align:left; width: 100%">

        </table>
    </div>
</div>






